Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Local filenames with colon should be parsed correctly #35123

Closed
wants to merge 1 commit into from

Conversation

shwanton
Copy link
Contributor

@shwanton shwanton commented Oct 28, 2022

Summary:

On RN Desktop, images can be copy/pasted into text inputs.
When copy/pasting local files w/ semi-colons in the filename (/downloads/devices:pre-call-IMG_346C38284B2B-1.jpeg), RN would throw this error.

CleanShot 2022-10-28 at 11 13 36

This was due to not having the correct asset loader because the local file path being parsed incorrectly.

To parse the url, we convert the string URI to a NSURL using a custom convertor fn.
The conversion was matching any : and assuming it was a network url scheme:
https://github.com/facebook/react-native/blob/main/React/Base/RCTConvert.m#L93-L107

When an image path with : in the name was passed to this, it was assuming it was a valid network url and not file path.

Because this is a local filepath, the image path needs to be a filesystem url. Since this was parsed as network url, it did not have the file:// prefix and would not pass this check, causing the loader to throw.
https://github.com/facebook/react-native/blob/main/Libraries/Image/RCTImageLoader.mm#L220-L231

Changelog

[iOS] [Added] - Add support for parsing local files w/ : in filename

Reviewed By: christophpurrer

Differential Revision: D40729963

Summary:
**Context**

On RN Desktop, images can be copy/pasted into text inputs.
When copy/pasting local files w/ semi-colons in the filename (`/downloads/devices:pre-call-IMG_346C38284B2B-1.jpeg`), RN would throw this error.

{F785684529}

The error was due to no having the correct asset loader due to the local file path being parsed incorrectly.

To parse the url, we convert the string URI to a `NSURL` using a custom convertor fn.
The conversion was matching any `:` and assuming it was a network url scheme:
https://www.internalfb.com/code/archon_react_native_macos/[fde4113acd89fb13ee11636c48b59eac49c21bae]/React/Base/RCTConvert.m?lines=97-111

When an image path with `:` in the name was passed to this, it was assuming it was a valid network url and not file path.

Because this is a local filepath, the image path needs to be a filesystem url. Since this was parsed as network url, it did not have the `file://` prefix and would not pass this check, causing the loader to throw.l
https://www.internalfb.com/code/fbsource/%5B60d9d5e67383%5D/xplat/js/react-native-github/Libraries/Image/RCTImageLoader.mm?lines=220-230

## Changelog

[iOS] [Added] -  Add support for parsing files w/ `:` in filename

Reviewed By: christophpurrer

Differential Revision: D40729963

fbshipit-source-id: 84cdca979d331f8704aa5f67de6f11e571abd474
@facebook-github-bot facebook-github-bot added CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. p: Facebook Partner: Facebook Partner fb-exported labels Oct 28, 2022
@facebook-github-bot
Copy link
Contributor

This pull request was exported from Phabricator. Differential Revision: D40729963

@react-native-bot react-native-bot added Platform: iOS iOS applications. Type: Enhancement A new feature or enhancement of an existing feature. labels Oct 28, 2022
@react-native-bot
Copy link
Collaborator

This pull request was successfully merged by @shwanton in 714b22b.

When will my fix make it into a release? | Upcoming Releases

@react-native-bot react-native-bot added the Merged This PR has been merged. label Nov 3, 2022
@jamesthomp
Copy link

@shwanton I believe this change has broken "mailto:test@example.com" links on iOS. For example doing Linking.openURL("mailto:test@example.com") is no longer working on iOS devices.

@shwanton
Copy link
Contributor Author

Thanks for catching this, I don't think we had a test for this case so I'll add one & fix the mailto condition.

@shwanton
Copy link
Contributor Author

@jamesthomp I just confirmed w/ RNTester that mailto url scheme works correctly with this fix.
If it's a valid mailto URL scheme, it won't hit the regex this PR fixed.

NSURL *URL = [NSURL URLWithString:path];
if (URL.scheme) { // Was a well-formed absolute URL
return URL;
}

If you are seeing "unresolved promises" when Linking a mailto url, you probably need to add the mailto scheme to your Info.plist
https://stackoverflow.com/questions/64580354/mailto-scheme-and-custom-mail-client-in-ios-14

CleanShot 2023-03-15 at 15 26 37

OlimpiaZurek pushed a commit to OlimpiaZurek/react-native that referenced this pull request May 22, 2023
Summary:
Pull Request resolved: facebook#35123

**Context**

On RN Desktop, images can be copy/pasted into text inputs.
When copy/pasting local files w/ semi-colons in the filename (`/downloads/devices:pre-call-IMG_346C38284B2B-1.jpeg`), RN would throw this error.

{F785684529}

The error was due to no having the correct asset loader due to the local file path being parsed incorrectly.

To parse the url, we convert the string URI to a `NSURL` using a custom convertor fn.
The conversion was matching any `:` and assuming it was a network url scheme:
https://www.internalfb.com/code/archon_react_native_macos/[fde4113acd89fb13ee11636c48b59eac49c21bae]/React/Base/RCTConvert.m?lines=97-111

When an image path with `:` in the name was passed to this, it was assuming it was a valid network url and not file path.

Because this is a local filepath, the image path needs to be a filesystem url. Since this was parsed as network url, it did not have the `file://` prefix and would not pass this check, causing the loader to throw.l
https://www.internalfb.com/code/fbsource/%5B60d9d5e67383%5D/xplat/js/react-native-github/Libraries/Image/RCTImageLoader.mm?lines=220-230

## Changelog

[iOS] [Added] -  Add support for parsing files w/ `:` in filename

Reviewed By: christophpurrer, philIip

Differential Revision: D40729963

fbshipit-source-id: 2f3adcabc8f0f1f22cbfca69c3484e72b1d93d25
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. fb-exported Merged This PR has been merged. p: Facebook Partner: Facebook Partner Platform: iOS iOS applications. Type: Enhancement A new feature or enhancement of an existing feature.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants